<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App',
  data(){
    return{
      beforeDate:0,
      gapTime:0,
    }
  },
  beforeCreate() {
    document.querySelector('body').setAttribute('style', 'margin:0;padding:0;')
  },
  mounted() {
    //事件绑定
    window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
    window.addEventListener('unload', e => this.unloadHandler(e))
  },
  destroyed() {
    //事件移除
    window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
    window.removeEventListener('unload', e => this.unloadHandler(e))
  },
  methods: {
    // 关闭窗口之前执行
    async beforeunloadHandler(e) {
      this.beforeDate = new Date().getTime()
    },
    // 关闭窗口之后执行
    unloadHandler() {
      this.gapTime = new Date().getTime() - this.beforeDate
      //判断是刷新还关闭
      if (this.gapTime < 5){
        console.log("关闭浏览器")
        this.$store.dispatch('logout')
      }else {
        console.log('刷新页面')
      }
    },
  }
}
</script>
<style scoped>
</style>
